<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>更新楼栋信息</title>
    <link href="../css/bootstrap.min.css" type="text/css" rel="stylesheet" />
    <script src="../js/jquery.min.js"></script>
    <style>
        /*设置背景*/
        body{
            background-color: #f6eff5;
        }
        /*最上方图片居中*/
        #img_four_1{
            height: 112px;
            width: 337px;
            margin: auto;
            margin-top: 20px;
            margin-bottom: 100px;
        }
        #sid{
            width: 300px;
            margin: auto;
            margin-top: 100px;
            margin-bottom: 10px;
        }
        #squad{
            width: 300px;
            margin: auto;
            margin-top: 100px;
            margin-bottom: 10px;
        }
    </style>
    <script>
        //学号
        function checkSid() {
            var reg = /^\d{7,15}$/;
            var sid = $("#sid").val();
            return reg.test(sid);
        }
        //班级
        function checkSquad() {
            var squad = $("#squad").val();
            var reg = /^[\u4e00-\u9fa5]{2,4}B?\d{1,5}班$/
            return reg.test(squad);
        }

        $(function () {

            //表单提交
            //按学号删除
            $("#del_sid_form").submit(function () {
                if (checkSid()){
                    $.post("tea/delBySid",$("#del_sid_form").serialize(),function () {
                        alert("该学生信息已删除！");
                        location.reload();
                    });
                }
                return false;
            });
            //按班级删除
            $("#del_squad_form").submit(function () {
                if (checkSquad()){
                    $.post("tea/delBySquad",$("#del_squad_form").serialize(),function () {
                        alert("该班级的学生信息已删除");
                        location.reload();
                    });
                }
                return false;
            });

            //离焦事件
            $("#sid").blur(function () {
                if (checkSid()){
                    //表示满足正则表达式
                    $(this).css("border","");
                }else{
                    //不满足正则表达式 加一个css样式
                    $(this).css("border","2px solid red");
                }
            });
            $("#squad").blur(function () {
                if (checkSquad()){
                    //表示满足正则表达式
                    $(this).css("border","");
                }else{
                    //不满足正则表达式 加一个css样式
                    $(this).css("border","2px solid red");
                }
            });

        });
    </script>
</head>
<body>
    <!-- 图片 -->
    <div id="img_four_1"><img src="../img/tea_4.png" id="img_hint"></div>
    <!-- form表单 -->
    <form id="del_sid_form">
        <span><input type="text" name="sid" id="sid" class="form-control" placeholder="请输入要删除学生的学号"></span>
        <span><input type="submit" value="确定" style="margin-left: 730px;width: 70px" class="btn btn-info"></span>
    </form>
    <form id="del_squad_form">
        <span><input type="text" name="squad" id="squad" class="form-control" placeholder="请输入要删除学生的班级"></span>
        <span><input type="submit" value="确定" style="margin-left: 730px;width: 70px" class="btn btn-info"></span>
    </form>
    <div style="float: right;margin-right: 50px">
        <a href="tea_main_page.html" class="btn btn-info">返回主界面</a>
    </div>

</body>
</html>